.ant-scrolling-effect {
  width: 100% !important;
}

// 重写antd组件样式
:root {

  /********************** Button start ****************************/
  .ant-btn {
    line-height: 1;
    padding: 0 16px;
    border-radius: 2px;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    border: none;

    &.ant-btn-sm {
      padding: 0 16px;
    }

    .btn-icon {
      width: 1em;
      height: 1em;
    }

    .btn-icon+span {
      margin-left: 8px;
    }
  }

  .ant-btn-primary {
    // background-color: var(--colorPrimary);
    color: #ffffff;

    &:hover {
      background-color: var(--btnBgColorPrimaryHover);
    }

    &:active {
      background-color: var(--btnBgColorPrimaryActive);
    }

    &:disabled {
      color: #fff;
      background-color: var(--btnBgColorPrimaryDisabled);
    }
  }

  .ant-btn-default {
    color: var(--text1Color);
    background-color: var(--modalHeaderBgColor);

    &:hover:not(:disabled):not(.ant-btn-dangerous) {
      color: var(--text1Color);
      background-color: var(--btnBgColorDefaultHover);
    }

    &:active:not(:disabled):not(.ant-btn-dangerous) {
      color: var(--text1Color);
      background-color: var(--btnBgColorDefaultActive);
    }

    &:disabled {
      background-color: var(--btnBgColorDefaultDisabled);
      color: var(--btnColorDefaultDisabled);
    }

    &.ant-btn-dangerous {
      background: #FFECE8;
      color: var(--colorDanger);
      border-color: var(--colorDanger);

      &:hover:not(:disabled) {
        background-color: #f6e0db;
      }
    }
  }

  // 蓝色文字及边框的按钮
  .primary-outline-btn {
    border: 1px solid var(--colorPrimary);
    color: var(--colorPrimary);
    background-color: transparent;

    &:hover:not(:disabled) {
      border-color: var(--btnBgColorPrimaryHover);
      color: var(--btnBgColorPrimaryHover);
      background-color: transparent;
    }

    &:active:not(:disabled) {
      border-color: var(--btnBgColorPrimaryActive);
      color: var(--btnBgColorPrimaryActive);
      background-color: transparent;
    }

    &:disabled {
      border-color: var(--btnBgColorPrimaryDisabled);
      color: var(--btnBgColorPrimaryDisabled);
      background-color: transparent;
    }
  }

  .ant-btn-link {

    // color: #4D88FF;
    &:hover:not(:disabled),
    &:active:not(:disabled) {
      //   color: #66A3FF;
      text-decoration: underline;
    }

    &:disabled {
      color: var(--btnColorLinkDisabled);
    }

    padding: 0;

    &+.ant-btn-link {
      margin-left: 16px;
    }
  }

  /********************** Button end ****************************/

  /********************** Input start ****************************/
  .ant-input,
  .ant-input-number,
  .ant-picker {
    // height: var(--commonFormItemHeight);
    border: 1px solid var(--borderColor);
    color: var(--formItemColor);

    .ant-select-selection-search-input {
      // height: 28px;
    }

    .ant-input-number-input {
      // height: var(--commonFormItemHeight);

      &::placeholder,
      input::placeholder {
        color: var(--placeholderColor);
      }
    }

    &::placeholder,
    input::placeholder {
      color: var(--placeholderColor);
    }

    &:hover,
    &:focus {
      box-shadow: 0px 0px 4px 0px rgba(22, 93, 255, 0.5);
      border: 1px solid var(--colorPrimary);
    }

    &:disabled {
      border: none;
      background-color: var(--formItemDisabledBgColor);
      color: var(--lightTipsColor);
      box-shadow: none;
    }
  }

  /********************** Search start ****************************/
  .ant-input-search {
    width: 240px;
    // height: var(--commonFormItemHeight);
    padding-right: 12px;
    transition: all 0.2s;
    .common-border();

    &:hover,
    &:focus {
      box-shadow: 0px 0px 4px 0px rgba(22, 93, 255, 0.5);
      border: 1px solid var(--colorPrimary);
    }

    .ant-input-wrapper {
      // height: 100%;
    }

    .ant-input {
      border: none;
      // height: 30px;

      &:hover,
      &:focus {
        border: none;
        box-shadow: none;
      }
    }

    .ant-input-group-addon {
      background-color: transparent;
      // height: 30px;

      .ant-input-search-button {
        color: var(--text1Color);
        background-color: transparent;
        width: 14px;
        height: 14px;
        background-image: url(../../assets/common/svgs/serach-icon.svg);
        background-size: 100% 100%;
        padding: 0;
        border: none;
        box-shadow: none;

        .anticon-search {
          display: none;
        }
      }
    }
  }

  /********************** Search end ****************************/


  // 有前缀的input
  .ant-input-affix-wrapper {
    // height: var(--commonFormItemHeight);

    &:hover,
    &:focus {
      box-shadow: 0px 0px 4px 0px rgba(22, 93, 255, 0.5);
      border: 1px solid var(--colorPrimary);
    }

    .ant-input {
      // height: 100%;
      // line-height: calc(100% - 8px);

      &:hover,
      &:focus {
        box-shadow: none;
        border: none;
      }

      &:disabled {
        border: none;
      }
    }
  }

  /********************** Input end ****************************/
  /********************** Select start ****************************/
  .ant-select {
    .ant-select-selector {
      // height: var(--commonFormItemHeight);
      border: 1px solid var(--borderColor);
      color: var(--formItemColor);

      .ant-select-selection-search-input,
      .ant-select-selection-item {
        // height: 100%;
      }

      .ant-select-selection-placeholder {
        color: var(--placeholderColor);
        line-height: 30px;
      }

      &::placeholder {
        color: var(--placeholderColor);
      }

      &:hover,
      &:focus {
        box-shadow: 0px 0px 4px 0px rgba(22, 93, 255, 0.5);
        border: 1px solid var(--colorPrimary);
      }
    }

    .ant-select-arrow {
      font-size: 10px;
      color: var(--text1Color);
    }
  }

  .ant-select.ant-select-disabled {
    .ant-select-selector {
      // height: var(--commonFormItemHeight);
      border: none;
      color: var(--lightTipsColor);
      background-color: var(--formItemDisabledBgColor);

      &:hover,
      &:focus {
        box-shadow: none;
        border: none;
      }
    }
  }

  .ant-select-dropdown {
    padding: 0;

    .ant-select-item {
      padding: 0 12px;
      border-radius: 0;
      // height: var(--commonFormItemHeight);
      line-height: var(--commonFormItemHeight);
    }

    .ant-select-item-option-selected,
    .ant-select-tree-treenode-selected {
      background-color: var(--colorPrimary) !important;
      color: #fff !important;
    }

    .ant-select-tree {
      .ant-select-tree-list {
        .ant-select-tree-treenode {
          // height: var(--commonFormItemHeight);
          width: 100%;
          padding: 0;
          white-space: nowrap;

          .ant-select-tree-node-content-wrapper {
            height: 100%;
            line-height: var(--commonFormItemHeight);

            &:hover {
              background-color: transparent;
            }
          }

          .ant-select-tree-switcher {
            line-height: var(--commonFormItemHeight);

            &:hover:before {
              background-color: transparent;
            }
          }

          .ant-select-tree-node-selected {
            background-color: transparent;
          }

          &:hover {
            background-color: rgba(0, 0, 0, 0.04);
          }
        }

        .ant-select-tree-treenode-selected {
          &:hover {
            background-color: var(--colorPrimary);
          }
        }
      }
    }
  }

  .ant-select-multiple {
    height: var(--commonFormItemHeight);
    padding: 0;

    &.ant-select-sm {
      height: var(--miniFormItemHeight);

      .ant-select-selector {
        padding: 2px 4px;
      }
    }

    .ant-select-selector {
      height: 100%;
      padding: 2px 4px;

      // align-items: flex-start;
      &:after {
        margin: 0;
      }


      .ant-select-selection-overflow {
        flex-wrap: nowrap;
        overflow: hidden;
        height: 100%;

        .ant-select-selection-overflow-item {
          height: 100%;

          .ant-select-selection-search-input {
            height: 100%;
          }

          .ant-select-selection-search-mirror {
            height: 100%;
          }
        }
      }

      .ant-select-selection-item {
        height: 100%;
        line-height: 1;
        border-radius: 2px;
        margin: 0 4px 0 0;
        align-items: center;
        background-color: var(--formItemDisabledBgColor);
        padding: 0 8px;

        .ant-select-selection-item-remove {
          color: unset;
        }
      }
    }

    &.ant-select-disabled {
      .ant-select-selection-item {
        border: none;
        background-color: #fff;
      }
    }
  }

  /********************** Select end ****************************/

  /********************** DatePicker start ****************************/
  .ant-picker-focused {
    box-shadow: 0px 0px 4px 0px rgba(22, 93, 255, 0.5);
    border: 1px solid var(--colorPrimary);
  }

  .ant-picker-input {
    input {
      color: var(--formItemColor);
    }
  }

  .ant-picker.ant-picker-disabled {
    border: none;
    color: var(--lightTipsColor);
    background-color: var(--formItemDisabledBgColor);

    &:hover,
    &:focus {
      box-shadow: none;
      border: 1px solid var(--borderColor);
    }
  }

  /********************** DatePicker start ****************************/

  /********************** Checkbox Radio start ****************************/
  .ant-checkbox-wrapper {
    &:not(.ant-checkbox-wrapper-disabled):hover {
      .ant-checkbox-inner {
        border-color: var(--colorPrimary);
      }
    }
  }

  .ant-checkbox-checked {
    .ant-checkbox-inner {
      border-color: var(--colorPrimary);
      background-color: var(--colorPrimary);
    }
  }

  .ant-checkbox-disabled .ant-checkbox-inner {
    background: #f5f5f5;
    border-color: var(--borderColor);
  }

  .ant-radio-wrapper {
    &:not(.ant-radio-wrapper-disabled):hover {
      .ant-radio-inner {
        border-color: var(--colorPrimary);
      }
    }

    .ant-radio-checked {
      .ant-radio-inner {
        border-color: var(--colorPrimary);
        background-color: #fff;

        &::after {
          transform: scale(0.5);
          background-color: var(--colorPrimary);
        }
      }
    }

    .ant-radio-disabled .ant-radio-inner {
      // background: #f5f5f5;
      border-color: var(--borderColor);

      &::after {
        background-color: var(--borderColor);
      }
    }
  }

  .ant-radio-wrapper-disabled {
    color: var(--lightTipsColor);
  }

  /********************** Checkbox Radio end ****************************/

  /********************** Modal start ****************************/
  .ant-modal {
    .ant-modal-content {
      padding: 0;
      background-color: #ffffff;
      border-radius: 4px;

      .ant-modal-close {
        // top: 12px;
        width: 16px;
        height: 16px;

        &:hover {
          background-color: transparent;
        }
      }

      .ant-modal-header {
        height: 48px;
        padding: 0 24px;
        margin-bottom: 0;
        background-color: var(--modalHeaderBgColor);
        // display: flex;
        // align-items: center;

        .ant-modal-title {
          font-size: 16px;
          font-weight: 700;
          height: 100%;
          display: flex;
          align-items: center;
        }
      }

      .ant-modal-body {
        padding: 24px;
      }

      .ant-modal-footer {
        margin-top: 0;
        padding: 8px 24px;
        border-top: 1px solid var(--borderColor);

        // .ant-btn {
        //   height: var(--commonFormItemHeight);
        // }

        .ant-btn+.ant-btn:not(.ant-dropdown-trigger) {
          margin-left: 10px;
        }

        // .btnClose {
        //   background-color: transparent;

        //   &:hover {
        //     background-color: rgba(215, 215, 215, 1);
        //     border: 1px solid var(--borderColor);
        //     color: #000000;
        //   }
        // }
      }
    }

    &.clear-bottom-padding-modal {
      .ant-modal-body {
        padding-bottom: 0;
      }
    }
  }

  /********************** Modal end ****************************/

  .ant-layout {
    background-color: transparent;

    .ant-layout-header {
      padding: 0;
      background-color: transparent;
      line-height: 1;
    }

    .ant-layout-sider {
      background-color: transparent;
    }

    .ant-layout-footer {
      background-color: transparent;
      padding: 0;
    }
  }

  .ant-steps {
    .ant-steps-item {
      .ant-steps-item-icon {
        width: 28px;
        height: 28px;
        background-color: var(--modalHeaderBgColor);

        .ant-steps-icon {
          color: var(--text1Color);
          top: -2px;
          font-weight: 600;
          font-size: 16px;
        }
      }

      .ant-steps-item-container {
        padding: 6px 16px 8px 16px;
        width: fit-content;
      }

      .ant-steps-item-content {

        // padding-right: 16px;
        .ant-steps-item-title {
          padding-right: 8px;
          line-height: 28px;
        }
      }


      &.ant-steps-item-active {
        .ant-steps-item-icon {
          background-color: var(--colorPrimary);
          border-color: var(--colorPrimary);

          .ant-steps-icon {
            color: #fff;
            top: -2px;
            font-weight: 600;
            font-size: 16px;
          }
        }

        .ant-steps-item-container {
          border-bottom: 2px solid var(--colorPrimary);
        }
      }

      &.ant-steps-item-wait {
        .ant-steps-item-content {
          .ant-steps-item-title {
            color: var(--text1Color);
          }
        }
      }

      &.ant-steps-item-finish {
        .ant-steps-item-icon {
          background-color: var(--colorPrimary);

          .ant-steps-icon {
            color: #fff;
          }
        }
      }

      &:not(:last-child) {
        .ant-steps-item-content::after {
          content: '';
          display: inline-block;
          width: 16px;
          height: 16px;
          position: relative;
          top: 3px;
          background-image: url(../../assets/common/svgs/right-arrow.svg);
        }
      }
    }

    .ant-steps-item-title::after {
      content: none;
    }
  }

  .ant-tabs {
    height: 100%;

    .ant-tabs-content {
      height: 100%;

      .ant-tabs-tabpane {
        height: 100%;
      }
    }

    .ant-tabs-content-holder {
      height: 100%;
    }
  }

  .ant-tabs {
    .ant-tabs-tab-btn {
      color: var(--text1Color);
    }

    .ant-tabs-nav {
      .ant-tabs-tab {
        padding: 8px 0;
      }
    }
  }

  /************* Tree start  *******************/
  .ant-tree {
    background-color: transparent;

    .ant-tree-treenode {
      width: 100%;
      height: 36px;
      padding-bottom: 0;
      flex-wrap: nowrap;
      align-items: center;
      cursor: pointer;

      &:hover {
        background: #f0f0f0;
      }

      .ant-tree-switcher {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 16px;
        margin-right: 4px;

        &:hover {
          background: #f0f0f0;

          &::before {
            background: #f0f0f0;
          }
        }

        .ant-tree-switcher-icon {
          font-size: 12px;
        }
      }

      .ant-tree-node-content-wrapper {
        display: flex;
        align-items: center;
        padding: 0;
        flex: auto;
        overflow: hidden;

        .ant-tree-iconEle {
          margin-right: 6px;

          .user-icon {
            position: relative;
            top: -2px;
          }
        }

        .ant-tree-title {
          max-width: 100%;
          display: inline-block;
          overflow: hidden;
          text-overflow: ellipsis;
          white-space: nowrap;
        }

        &:hover {
          background: transparent;
        }
      }

      // &:not(.ant-tree-treenode-selected):hover {
      //   background: rgba(0, 0, 0, 0.04);
      // }

      &[aria-hidden="true"] {
        width: unset;
      }
    }

    .ant-tree-treenode-selected {
      // background-color: #f4f7fd;
      color: var(--colorPrimary);

      .ant-tree-node-selected {
        background-color: transparent;
      }
    }

    .ant-tree-indent-unit {
      width: 16px;
    }

    &.v-padding-tree {
      .ant-tree-treenode {
        padding: 0 4px;
      }
    }
  }

  /************* Tree end  *******************/

  .ant-form-item {

    .ant-form-item-label {
      label {
        color: var(--formLabelColor);
        // font-size: 12px;
      }
    }
  }

  .ant-form-item-explain-error {
    font-size: 12px;
  }


  .ant-drawer {
    position: absolute;

    .ant-drawer-content-wrapper {
      box-shadow: none;
    }
  }

  //.ant-dropdown-menu样式
  .ant-dropdown {
    .ant-dropdown-menu {
      padding: 0;

      .ant-dropdown-menu-item {
        height: 32px;
      }
    }
  }
}